<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        /* 
            1、let 不能重复声明；
            2、let有块级作用域，非函数的花括号遇见let会有块级作用域，也就是只能在花括号里面访问；
            3、let不会预解析进行变量提升；(必须先声明在使用)->var可以先使用在进行声明
            4、let 定义的全局变量不会作为window的属性；
            5、let在es6中推荐优先使用；
        */
        let a = 1
        //let a = 1

        {
            let a = 100
            var b = 99
        }
        console.log(a);
        console.log(b);

        let c = 1000
        console.log(c);

        let d = 100;
        console.log(window.d);
        var e = 12
        console.log(window.e);

        //const声明常量不能进行更改
        const PI = 3.14
        //PI = 3.1415926
        console.log(PI);
        //对应数组和对象元素修改，不算常量修改，修改值，不修改地址
        const TEAM = ["张三", "李四", "王五", "赵六"]
        TEAM.push("孙七")
        //TEAM=[]报错
        console.log(TEAM);

        //多行普通字符串
        let ulStr = "<ul>" + "<li>JAVA</li>"
        let name = '赵谦'
        let infoStr = name + '6666'
        //多行模板字符串
        let ulStr2 =
            `<ul>
            <li>JAVA</li>`
        console.log(ulStr2);
        let infoStr2 = `${name}6666`
        console.log(infoStr2);

        //解构表达式
        //数组解构赋值
        let [bb, ee, ff, gg = 4] = [1, 2, 3]
        console.log(bb, ee, ff, gg);
        //对象解构赋值
        let { aa, dd } = { aa: 1, dd: 2 }
        console.log(aa, dd);

        //箭头函数
        //函数声明
        let fn1 = function () { }//普通声明方式
        let fn2 = () => { }//箭头函数声明
        let fn3 = x => { }//只有一个参数可以省略(),多参数不可以省略()
        let fn4 = x => x + 1//只有一行方法体可以省略{}
        let fn5 = x => console.log(x);//当函数体只有一句返回值时，可以省略花括号和return语句
        //使用特点，箭头函数this关键字
        //箭头哈桉树没有自己的this，this指向的是外层上下文环境的this
        let person ={
            name:"张三",
            showName:function(){
                console.log(this);//this是person
                console.log(this.name);
            },
            viewName:()=>{
                console.log(this);//this是window
                console.log(this.name);
            }
        }
        person.showName()
        person.viewName()
        //this应用
        function Counter(){
            this.count = 0;
            setInterval(() => {
                this.count++;
                console.log(this.count);
                
            },1000)
        }
        let counter = new Counter();
        
    </script>
</body>

</html>